<template>
  <el-select style="width: 100%" v-model="groupName" value-key="id" clearable filterable placeholder="请选择团购名"
             :filter-method="remoteMethod" @change="selectShop">
    <el-option v-for="item in groupList" :key="item.id" :label="item.name" :value="item">
    </el-option>
  </el-select>
</template>

<script>
import {groupList as list} from '@/api/groupBuy'
import utils from '../../utils/utils.js'
export default {
  data() {
    return {
      groupName: '',
      groupList: [],
      query:{
        groupId:'',
        name:""
      }
    }
  },
  created(){
    var _this = this
    _this.loadGroup('')
  },
  methods: {
    remoteMethod(query) {
      this.loadGroup(query)
    },
    loadGroup(query) {
      var _this = this
      let params = new URLSearchParams();
      params.append('keyword', query)
      params.append('type', 2)
      params.append('isShow', false)
      list(params).then(response => {
        _this.groupList = response.data.data
      }).catch(error => {
        console.log('error!!')
      });
    },
    selectShop(e) {
      if (!utils.isNull(e)) {
        this.query.groupId = e.id
        this.query.name = e.name
      } else {
        this.query.groupId=""
        this.query.name = ''
      }
      this.$emit('queryGroupClick',this.query)
    },
  },
}
</script>

<style>
</style>
